<template>
	<div style="width: 100%;">
		<van-row style="width: 100%;height: 5vh; position: fixed;top: 0px;background-color: #FFFFFF;z-index: 99;">
			<van-col span="24" style="width: 100%; height: 5vh;line-height: 7vh;display: flex;flex-wrap: nowrap;">
				<div style="width: 6%;height: 5vh;margin-left: 3%;">
					<van-icon name="arrow-left" size="25" style="margin-top: 1vh;" @click="backmine()"/>
				</div>
				<div style="width: 91%;height: 5vh;line-height:6vh;font-size: 18px;font-weight: 600;">
					设置
				</div>
			</van-col>
		</van-row>
		<van-row style="width: 94%;height: 5vh;margin-left: 3%;">
			<van-col span="24" style="height: 5vh;line-height: 5vh;display: flex;flex-wrap: nowrap;">
				
			</van-col>
		</van-row>
		<van-row style="width: 94%;height: 17vh;margin-left: 3%;margin-top: 5vh;box-shadow: -1px -1px 3px 2px #f3f3f3;border-radius: 10px;">
			<van-col span="24" style="height: 17vh;">
				<div style="width: 100%;height: 10vh;border-bottom: 1px solid #f3f3f3;display: flex;flex-wrap: nowrap;">
					<div style="width: 20%;height: 10vh;">
						<img :src="usernews.headerImg" style="width: 90%;height: 90%;border-radius: 50%;margin-left: 5%;margin-top: 5%;" >
					</div>
					<div style="width: 68%;height: 10vh;margin-left: 3%;">
						<div style="width: 100%;height: 5vh;line-height: 6vh;font-weight: 600;text-align: left;">
							{{usernews.nickName}}
						</div>
						<div style="width: 100%;height: 5vh;line-height: 5vh;font-size: 13px;text-align: left;">
							{{usernews.nickName}} 龙腾四海
						</div>
					</div>
					<div style="width: 12%;height: 10vh;">
						<van-icon name="arrow" size="25" style="margin-top: 3vh;" color="#ccc"/>
					</div>
				</div>
				<div style="width: 100%;height: 7vh;line-height:7vh;display:flex;flex-wrap: nowrap;">
					<div style="width:85%;height: 7vh;margin-left: 5%;font-size: 15px;text-align: left;">
						我的收货地址
					</div>
					<div style="width:12%;height: 7vh;">
						<van-icon name="arrow" size="25" style="margin-top: 2vh;" color="#ccc"/>
					</div>
				</div>
			</van-col>
		</van-row>
		
		<van-row style="width: 94%;height: 14vh;margin-left: 3%;margin-top: 5vh;box-shadow: -1px -1px 3px 2px #f3f3f3;border-radius: 10px;">
			<van-col span="24" style="height: 14vh;">
				<div style="width: 100%;height: 7vh;line-height:7vh;border-bottom: 1px solid #f3f3f3;display: flex;flex-wrap: nowrap;">
					<div style="width:85%;height: 7vh;margin-left: 5%;font-size: 15px;text-align: left;">
						账户与安全
					</div>
					<div style="width:12%;height: 7vh;">
						<van-icon name="arrow" size="25" style="margin-top: 2vh;" color="#ccc"/>
					</div>
				</div>
				<div style="width: 100%;height: 7vh;line-height:7vh;display:flex;flex-wrap: nowrap;">
					<div style="width:85%;height: 7vh;margin-left: 5%;font-size: 15px;text-align: left;">
						支付
					</div>
					<div style="width:12%;height: 7vh;">
						<van-icon name="arrow" size="25" style="margin-top: 2vh;" color="#ccc"/>
					</div>
				</div>
			</van-col>
		</van-row>
		
		
		<van-row style="width: 94%;height: 21vh;margin-left: 3%;margin-top: 5vh;box-shadow: -1px -1px 3px 2px #f3f3f3;border-radius: 10px;">
			<van-col span="24" style="height: 21vh;">
				<div style="width: 100%;height: 7vh;line-height:7vh;border-bottom: 1px solid #f3f3f3;display: flex;flex-wrap: nowrap;">
					<div style="width:85%;height: 7vh;margin-left: 5%;font-size: 15px;text-align: left;">
						消息与安全
					</div>
					<div style="width:12%;height: 7vh;">
						<van-icon name="arrow" size="25" style="margin-top: 2vh;" color="#ccc"/>
					</div>
				</div>
				<div style="width: 100%;height: 7vh;line-height:7vh;display:flex;flex-wrap: nowrap;border-bottom: 1px solid #f3f3f3;">
					<div style="width:85%;height: 7vh;margin-left: 5%;font-size: 15px;text-align: left;">
						隐私
					</div>
					<div style="width:12%;height: 7vh;">
						<van-icon name="arrow" size="25" style="margin-top: 2vh;" color="#ccc"/>
					</div>
				</div>
				<div style="width: 100%;height: 7vh;line-height:7vh;display:flex;flex-wrap: nowrap;border-bottom: 1px solid #f3f3f3;">
					<div style="width:85%;height: 7vh;margin-left: 5%;font-size: 15px;text-align: left;">
						通用
					</div>
					<div style="width:12%;height: 7vh;">
						<van-icon name="arrow" size="25" style="margin-top: 2vh;" color="#ccc"/>
					</div>
				</div>
			</van-col>
		</van-row>
		
		
		<van-row style="width: 94%;height: 14vh;margin-left: 3%;margin-top: 5vh;box-shadow: -1px -1px 3px 2px #f3f3f3;border-radius: 10px;">
			<van-col span="24" style="height: 14vh;">
				<div style="width: 100%;height: 7vh;line-height:7vh;border-bottom: 1px solid #f3f3f3;display: flex;flex-wrap: nowrap;">
					<div style="width:85%;height: 7vh;margin-left: 5%;font-size: 15px;text-align: left;">
						帮助与反馈
					</div>
					<div style="width:12%;height: 7vh;">
						<van-icon name="arrow" size="25" style="margin-top: 2vh;" color="#ccc"/>
					</div>
				</div>
				<div style="width: 100%;height: 7vh;line-height:7vh;display:flex;flex-wrap: nowrap;">
					<div style="width:85%;height: 7vh;margin-left: 5%;font-size: 15px;text-align: left;">
						关于果粉
					</div>
					<div style="width:12%;height: 7vh;">
						<van-icon name="arrow" size="25" style="margin-top: 2vh;" color="#ccc"/>
					</div>
				</div>
			</van-col>
		</van-row>
		
		<button style="width: 94%;margin-left: 3%;height: 7vh;margin-top: 3vh;border-radius: 10px;text-align: center;line-height: 7vh;color: #FFFFFF;background-color: #323233;">切换账户</button>
		<button @click="clearuser" style="width: 94%;margin-left: 3%;height: 7vh;margin-top: 3vh;border-radius: 10px;text-align: center;line-height: 7vh;color: #FFFFFF;background-color: #323233;">退出登录</button>
	</div>
</template>

<script>
	export default {
		data(){
			return{
				usernews:[]
			}
		},
		created() {
			let user = JSON.parse(localStorage.getItem('usernews'))
			console.log(user)
			this.usernews = user
		},
		methods:{
			clearuser(){
				localStorage.clear('usernews')
				this.$router.push({path:'/mine'})
			},
			backmine(){
				this.$router.push({path:'/mine'})
			}
		}
	}
</script>

<style>
</style>
